<template>
    <a-modal
            :title="tableTitle"
            :visible="visible"
            width="1200px"
            @ok="handleOk"
            :maskClosable="false"
            :confirmLoading="confirmLoading"
            @cancel="handleCancel"
    >
        <a-form-model ref="form" :model="form">
            <a-descriptions bordered :column="2">
                <a-descriptions-item label="载体名称">
                    <a-form-model-item>
                        <a-input
                                :maxLength="100"
                                :placeholder="'请输入载体名称'"
                                v-model="form.carrierName">
                        </a-input>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="载体级别">
                    <a-form-model-item>
                        <a-radio-group v-model="form.carrierLevel">
                            <a-radio :value="item.codeMasterValue" :key="index"
                                     v-for="(item,index) in $store.getters.dictionary.CARRIER_LEVEL">
                                {{item.codeMasterName}}
                            </a-radio>
                        </a-radio-group>
                    </a-form-model-item>
                </a-descriptions-item>

                <!-- <a-descriptions-item label="载体类型">
                    <a-form-model-item>
                        <a-radio-group v-model="form.carrierLevel">
                            <a-radio :value="item.codeMasterValue" :key="index"
                                     v-for="(item,index) in $store.getters.dictionary.CARRIER_LEVEL">
                                {{item.codeMasterName}}
                            </a-radio>
                        </a-radio-group>
                    </a-form-model-item>
                </a-descriptions-item> -->


                <a-descriptions-item label="运营机构">
                    <a-form-model-item>
                        <a-input
                                :maxLength="100"
                                :placeholder="'请输入运营机构'"
                                v-model="form.comName">
                        </a-input>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="机构性质">
                    <a-form-model-item>
                        <a-radio-group v-model="form.comNature">
                            <a-radio :value="item.codeMasterValue" :key="index"
                                     v-for="(item,index) in $store.getters.dictionary.COM_NATURE">
                                {{item.codeMasterName}}
                            </a-radio>
                        </a-radio-group>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="载体成立时间" >
                    <a-form-model-item>
                        <xlDate
                                :min="0"
                                :disabled="form.carrierRegDate == false"
                                :placeholder="'请输入载体成立时间'"
                                v-model="form.carrierRegDate">
                        </xlDate>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="载体类别" >
                    <a-form-model-item>
                        <a-radio-group v-model="form.carrierType">
                            <a-radio value="1">孵化器</a-radio>
                            <a-radio value="2">众创空间</a-radio>
                            <a-radio value="3">新型研发机构</a-radio>
                            <a-radio value="4">硅巷</a-radio>
                        </a-radio-group>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="场地面积(平方米)">
                    <a-form-model-item>
                        <a-input-number
                                :min="0"
                                :placeholder="'请输入场地面积'"
                                v-model="form.buildingArea">
                        </a-input-number>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="其中企业办公面积(平方米)">
                    <a-form-model-item>
                        <a-input-number
                                :min="0"
                                :placeholder="'请输入其中企业办公面积'"
                                v-model="form.workingArea">
                        </a-input-number>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="是否设立孵化基金" v-if="form.carrierType == 1 || form.carrierType == 3">
                    <a-form-model-item>
                        <a-radio-group v-model="form.incubatedFundFlag" @change="()=>{
                            form.incubatedFundAmt = 0
                        }">
                            <a-radio :value="true">
                                是
                            </a-radio>
                            <a-radio :value="false">
                                否
                            </a-radio>
                        </a-radio-group>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="孵化基金金额(万元)" v-if="form.carrierType == 1 || form.carrierType == 3">
                    <a-form-model-item>
                        <a-input-number
                                :min="0"
                                :disabled="form.incubatedFundFlag == false"
                                :placeholder="'请输入孵化基金金额'"
                                v-model="form.incubatedFundAmt">
                        </a-input-number>
                    </a-form-model-item>
                </a-descriptions-item>
                
                <a-descriptions-item label="载体管理制度建设" span="2">
                    <a-form-model-item>
                        <a-checkbox-group v-model="form.regulationType" @change="(e)=>{
                               if(e.indexOf('0') == -1){
                                    form.regulationOther = ''
                               }
                        }">
                            <a-checkbox :value="item.codeMasterValue" :key="index"
                                        v-for="(item,index) in $store.getters.dictionary.REGULATION_TYPE">
                                {{item.codeMasterName}}
                            </a-checkbox>
                        </a-checkbox-group>
                        <a-input
                                :maxLength="100"
                                v-if="form.regulationType.indexOf('0') != -1"
                                size="small"
                                class="otherInput"
                                :placeholder="'请输入其他载体管理制度建设'"
                                v-model="form.regulationOther">
                        </a-input>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="设施和条件情况" v-if="form.carrierType == 2" span="2">
                    <a-form-model-item>
                        <a-checkbox-group v-model="form.facilityType" @change="(e)=>{
                               if(e.indexOf('0') == -1){
                                    form.facilityOther = ''
                               }
                        }">
                            <a-checkbox :value="item.codeMasterValue" :key="index"
                                        v-for="(item,index) in $store.getters.dictionary.FACILITY_TYPE">
                                {{item.codeMasterName}}
                            </a-checkbox>
                        </a-checkbox-group>
                        <a-input
                                :maxLength="100"
                                v-if="form.facilityType.indexOf('0') != -1"
                                size="small"
                                class="otherInput"
                                :placeholder="'请输入其他设施和条件情况'"
                                v-model="form.facilityOther">
                        </a-input>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="认定级别的文件" span="2">
                    <a-form-model-item>
                        <xluploadFile v-model="form.levelProofPath"></xluploadFile>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="载体logo" span="2">
                    <xlImages v-model="form.carrierLogo" :max="1"></xlImages>
                </a-descriptions-item>
                <a-descriptions-item label="营业执照上传" span="2">
                    <xlImages v-model="form.baseLicensePath" :max="1"></xlImages>
                </a-descriptions-item>
                <a-descriptions-item label="载体展示照片上传" span="2">
                    <xlImages v-model="form.carrierPhotos" :max="5"></xlImages>
                </a-descriptions-item>
                <a-descriptions-item label="载体概况" span="2">
                    <a-form-model-item>
                        <ueditor
                                :placeholder="'请输入载体概况'"
                                v-model="form.carrierDescribe">
                        </ueditor>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="特色服务" span="2">
                    <a-form-model-item>
                        <ueditor
                                :placeholder="'请输入特色服务'"
                                v-model="form.carrierServices">
                        </ueditor>
                    </a-form-model-item>
                </a-descriptions-item>
                <a-descriptions-item label="周边配套" span="2">
                    <a-form-model-item>
                        <ueditor
                                :placeholder="'请输入周边配套'"
                                v-model="form.carrierSurrounding">
                        </ueditor>
                    </a-form-model-item>
                </a-descriptions-item>
            </a-descriptions>
        </a-form-model>
    </a-modal>
</template>

<script>
    import xlDate from '../../../../../components/formUntil/xlDate'
    import xlImage from '../../../../../components/formUntil/xlImage'
    import xluploadFile from '../../../../../components/formUntil/xluploadFile'
    import xlImages from '../../../../../components/formUntil/xlImages'
    import ueditor from '../../../../../components/ueditor'
    export default {
        name: "xlForm",
        data() {
            return {
                tableTitle: '编辑',
                visible: false,
                confirmLoading: false,
                form: {
                    facilityType: [],
                    regulationType: []
                },
                rules: {}
            }
        },
        components: {
            xlDate,
            xlImage,
            xluploadFile,
            xlImages,
            ueditor
        },
        methods: {
            handleOk() {
                this.$refs.form.validate(valid => {
                    console.log(valid)
                    if (valid) {
                        let formData = Object.assign({},this.form)
                        formData.facilityType = formData.facilityType.toString()
                        formData.regulationType = formData.regulationType.toString()
                        this.confirmLoading = true
                        this.$emit('handleOk', formData)
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            handleCancel() {
                this.visible = false
            },
            formatForm(form) {
                delete form.createDateTime
                delete form.modifyDateTime
                delete form.modifyBy
                delete form.createBy
                //整理字段数据 ／ 赋值 清空等
                this.$nextTick(_=>{

                    this.form = Object.assign({}, form)
                    this.form.facilityType = this.form?.facilityType?.split(',') || []
                    this.form.regulationType = this.form?.regulationType?.split(',') || []

                })
            }
        }
    }
</script>

<style scoped lang="less">
    /deep/ .ant-form-item {
        margin: 0;
    }

    /deep/ .ant-input-number {
        width: 100%;
    }

    .xl-dateRange {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .ant-checkbox-group {
        display: flex;
        flex-wrap: wrap;

        .xl-checkbox {
            display: flex;
            align-items: center;

            /deep/ span:nth-child(2):not(.ant-checkbox-inner) {
                display: flex;
                justify-content: space-between;
                white-space: pre;
            }
        }
    }
</style>
